<template>
  <el-button
    type="danger"
    icon="Delete"
    size="default"
    @click="click"
    v-hasPermi="perm"
    v-hasRole="role"
    v-hasRoleType="roleType"
  >{{ text }}</el-button
  >
</template>

<script>
export default {
  name: 'ClearButton',
  inheritAttrs: false,
  props: {
    text: {
      type: String,
      required: false,
      default: () => '清空'
    },
    title: {
      type: String,
      required: false,
      default: () => '是否确认清空所有的数据'
    },
    confirm: {
      type: Boolean,
      required: false,
      default: () => true
    },
    perm: {
      type: Array,
      required: false,
      default: () => []
    },
    role: {
      type: Array,
      required: false,
      default: () => []
    },
    roleType: {
      type: Array,
      required: false,
      default: () => []
    }
  },
  methods: {
    click() {
      if (this.confirm === false) {
        this.$emit('click')
      } else {
        this.$confirm(this.title, '警告', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(() => {
            this.$emit('click')
          })
          .catch((e) => {
            console.error(e)
          })
      }
    }
  }
}
</script>
